<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>欢迎登录BruceShop</title>
    <link rel="shortcut icon" href="/public/img/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
    <link rel="stylesheet" href="/public/css/login.css">
</head>

<body>
    <div class="main">
        <div class="header">
            <h1>欢迎登录BruceShop</h1>
        </div>

        <div class="alert alert-danger" role="alert">
            <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
            <span class="err_message">{{ err_message }}</span>
        </div>

        <form id="login_form" action="/login" method="post">
            <div class="form-group">
                <label for="">账户名</label>
                <input type="text" class="form-control" id="" name="username" placeholder="Username"
                    value="{{ form && form.username }}" autofocus>
            </div>
            <div class="form-group">
                <label for="">密码</label>
                <input type="password" class="form-control" id="" name="password" placeholder="Password"
                    value="{{ form && form.password }}">
            </div>
            <div class="form-group">
                <label for="">登录身份</label>
                <select class="form-control" name="identity">
                    <option>用户</option>
                    <option>销售人员</option>
                    <option>管理员</option>
                </select>
            </div>
            <br>
            <button type="submit" class="btn btn-success btn-block" style="margin-bottom: 5px;">登录</button>
        </form>

        <div class="message">
            <p>没有账号? <a href="/register">点击创建</a>。或者以<a href="/index">游客身份浏览</a>。</p>
        </div>
    </div>
</body>

<script>
    var err = document.querySelector('.err_message')
    var errDiv = document.querySelector('.alert-danger')
    if (err.innerText != '') {
        errDiv.style.display = 'block'
    }
</script>

</html>